---
sidebar_position: 6
---

import View360, { EVENTS } from "@site/src/components/View360";

```ts
import { EVENTS, ProjectionChangeEvent } from "@egjs/view360";

// Typescript
const onProjectionChange = (evt: ProjectionChangeEvent) => {};

view360.on(EVENTS.PROJECTION_CHANGE, onProjectionChange);
```

An event that fires after projection changes

## Properties
### projection: [Projection](/docs/api/Projection/Class/Projection)
An instance of new projection applied

:::info
The example below intentionally disabled all controls for event order checking.

The following is a list of available events in the example:
- "loadStart", "load", "ready", "projectionChange"
:::

<View360
  projectionOptions={{
    src: "/pano/equirect/veste.jpg"
  }}
  license="veste"
  clickToLoad={true}
  rotate={false}
  zoom={false}
  gyro={false}
  showControlBar={false}
  showEvents={[EVENTS.LOAD_START, EVENTS.LOAD, EVENTS.READY, EVENTS.PROJECTION_CHANGE]} />
